<% content_for('page_scripts') do -%>
      function toggleFCKeditor(id) {
        if (document.getElementById("part[" + id + "][fckeditor]_1").checked && !document.getElementById("part[" + id + "][content]___Frame")) {
          var oFCKeditor = new FCKeditor("part[" + id + "][content]");
          
          oFCKeditor.BasePath = "/javascripts/admin/extensions/fckeditor/";
          oFCKeditor.ReplaceTextarea();
        }
        
        if (document.getElementById("part[" + id + "][fckeditor]_1").checked && document.getElementById("part[" + id + "][content]___Frame").style.display == 'block') {
          return;
        }
        
        if (document.getElementById("part[" + id + "][fckeditor]_1").checked && document.getElementById("part[" + id + "][content]___Frame").style.display == 'none') {
          document.getElementById("part[" + id + "][content]___Frame").style.display = 'block';
          
          FCKeditorAPI.GetInstance('part[0][content]').SetHTML(document.getElementById("part[" + id + "][content]").value)
          
          document.getElementById("part[" + id + "][content]").style.display = 'none';
        }
        
        if (document.getElementById("part[" + id + "][fckeditor]_0").checked && document.getElementById("part[" + id + "][content]___Frame")) {
          document.getElementById("part[" + id + "][content]___Frame").style.display = 'none';
          
          FCKeditorAPI.GetInstance('part[0][content]').UpdateLinkedField();
          
          document.getElementById("part[" + id + "][content]").style.display = 'block';
        }
      }

      function part_added() {
        var partNameField = $('part-name-field');
        var partIndexField = $('part-index-field');
        var index = parseInt(partIndexField.value);
        var tab = 'tab-' + index;
        var caption = partNameField.value;
        var page = 'page-' + index;
        tabControl.addTab(tab, caption, page);
        Element.hide('add-part-popup');
        Element.hide('busy');
        partNameField.value = '';
        partIndexField.value = (index + 1).toString();
        $('add-part-button').disabled = false;
        Field.focus(partNameField);
        tabControl.select(tab);
      }
      function part_loading() {
        $('add-part-button').disabled = true;
        new Effect.Appear('busy');
      }
      function valid_part_name() {
        var partNameField = $('part-name-field');
        var name = partNameField.value.downcase().strip();
        var result = true;
        if (name == '') {
          alert('Part name cannot be empty.');
          return false;
        }
        tabControl.tabs.each(function(pair){
          if (tabControl.tabs[pair.key].caption == name) {
            result = false;
            alert('Part name must be unique.');
            throw $break;
          }
        })
        return result;
      }
      function center(element) {
        var header = $('header')
        element = $(element);
        element.style.position = 'absolute';
        var dim = Element.getDimensions(element);
        var top = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop;
        element.style.top = (top + 200) + 'px';
        element.style.left = ((header.offsetWidth - dim.width) / 2) + 'px';
      }
      function toggle_add_part_popup() {
        var popup = $('add-part-popup');
        var partNameField = $('part-name-field');
        center(popup);
        Element.toggle(popup);
        Field.focus(partNameField);
      }
      var last_type = "<%= @page.class_name %>";
      function load_tag_reference(part) {
        page_type = $F('page_class_name');
        popup = $('tag-reference-popup');
        if(last_type != page_type) {
          url = "<%= tag_reference_url %>";
          params = "class_name=" + page_type;
          new Effect.Highlight('tag-reference-link-'+ part);
          req = new Ajax.Request(url, { method: 'get', parameters: params, evalScripts: true });
        } else {
           center(popup);
           Element.toggle(popup);
        }
        return false;
      }
      var last_filter = "<%= default_filter_name %>";
      function load_filter_reference(part) {
        filter_type = $F("part[" + part + "][filter_id]");
        popup = $('filter-reference-popup');
        if(last_filter != filter_type) {
          url = "<%= filter_reference_url %>";
          params = "filter_name=" + filter_type;
          new Effect.Highlight('filter-reference-link-'+ part);
          req = new Ajax.Request(url, { method: 'get', parameters: params, evalScripts: true });
        } else {
          center(popup);
          Element.toggle(popup);
        }
        return false;
      }
<% end -%>

<% content_for :page_css do %>
      #content #extended-metadata .fieldset {
        margin-left: 0;
        margin-right: 0;
        margin-bottom: .5em;
        padding: 0;
      }
      #content #extended-metadata .fieldset td.label {
        text-align: left;
        width: 15%;
      }
      #content #extended-metadata .fieldset td.field .textbox {
        width: 90%;
      }
<% end %>

<% include_javascript "tag_reference_search" %>
<% include_javascript "admin/extensions/fckeditor/fckeditor" %>
<% if @page.new_record? -%>
<h1 id="new_page">New Page</h1>
<% else -%>
<h1 id="edit_page">Edit Page</h1>
<% end -%>

<form method="post" enctype="multipart/form-data">
  <%= hidden_field "page", "lock_version" %>
  <div class="form-area">
    <p class="title">
      <label for="page_title">Page Title</label>
      <%= text_field "page", "title", :class => 'textbox', :maxlength => 255 %>
    </p>
    <div id="extended-metadata" class="row"<%= meta_visible(:meta) %>>
      <table class="fieldset" cellpadding="0" cellspacing="0" border="0">
        <% for meta in @meta %>
            <%= render :partial => "meta_row", :object => meta %>
        <% end %>
      </table>
      <script type="text/javascript">
      // <![CDATA[
        $title = $('page_title');
        $slug = $('page_slug');
        $breadcrumb = $('page_breadcrumb');
        $old_title = $title.value || '';
        function title_updated() {
          if ($old_title.toSlug() == $slug.value) $slug.value = $title.value.toSlug();
          if ($old_title == $breadcrumb.value) $breadcrumb.value = $title.value;
          $old_title = $title.value;
        }
        new Form.Element.Observer('page_title', 0.15, title_updated);
      // ]]>
      </script>
    </div>
    <p class="more-or-less">
      <small>
        <a href="#" onclick="<%= toggle_javascript_for('extended-metadata') %>"<%= meta_visible(:meta_more) %> id="more-extended-metadata">More</a>
        <a href="#" onclick="<%= toggle_javascript_for('extended-metadata') %>"<%= meta_visible(:meta_less) %> id="less-extended-metadata">Less</a>
      </small>
    </p>
    <div id="tab-control">
      <div id="tabs" class="tabs">
        <div id="tab-toolbar">
          <%= link_to_function image('plus'), 'toggle_add_part_popup()', :title => 'Add Tab' %>
          <%= link_to_function image('minus'), 'if(confirm(\'Delete the current tab?\')) { tabControl.removeTab(tabControl.selected) }', :title => 'Remove Tab' %>
        </div>
      </div>
      <div id="pages" class="pages">
<%= render :partial => 'part', :collection => @page.parts %>
      </div>
    </div>
    <script type="text/javascript">
    // <![CDATA[
      var tabControl = new TabControl('tab-control');
<%
@index = 0
for @part in @page.parts do
  @index += 1
-%>
      tabControl.addTab('tab-<%= @index %>', '<%= @part.name %>', 'page-<%= @index %>');
<%
end
-%>
      tabControl.select(tabControl.firstTab());
    // ]]>
    </script>
    <div class="row">
      <p><label for="page_layout_id">Layout</label>
        <%= select "page", "layout_id", [['<inherit>', '']] + Layout.find(:all).map { |s| [s.name, s.id] } %></p>
      <p><label for="page_class_name">Page Type</label>
        <%= select "page", "class_name", [['<normal>', 'Page']] + Page.descendants.map { |p| [p.display_name, p.name] }.sort_by { |p| p.first } %></p>
      <p><label for="page_status_id">Status</label>
        <%= select "page", "status_id", Status.find_all.map { |s| [s.name, s.id] } %></p>
    </div>
    <span class="clear">&nbsp;</span>
    <%= updated_stamp @page %>
  </div>
  <% @buttons_partials.each do |partial| %>
    <%= render :partial => partial %>
  <% end %>
  <p class="buttons">
    <%= save_model_button(@page) %> <%= save_model_and_continue_editing_button(@page) %> or <%= link_to "Cancel", page_index_url %>
  </p>
</form>

<% content_for :popups do -%>
  <div class="popup" id="add-part-popup" style="display: none">
    <div id="busy" class="busy" style="display: none"><%= image 'spinner.gif' %></div>
    <h3>Add Part</h3>
    <% form_remote_tag(
      :url => page_add_part_url,
      :update => "pages", 
      :position => :bottom, 
      :loading => 'part_loading()', 
      :complete => 'part_added()',
      :condition => 'valid_part_name()'
    ) do %> 
      <div>
        <%= hidden_field_tag 'index', @index + 1, :id => 'part-index-field' %>
        <%= text_field_tag "part[name]", "", :id => 'part-name-field', :maxlength => 100 %> 
        <%= submit_tag "Add Part", :id => 'add-part-button' %>
      </div>
      <p><%= link_to_function 'Close', "Element.hide('add-part-popup')", :class => 'close-link' %></p>
    <% end %>
  </div>
  <div class="popup" id="tag-reference-popup" style="display:none;">
    <div style="float:right">Search Tags: <input type="text" id="search-tag-reference"></div>
    <%= javascript_tag "new Form.Element.Observer('search-tag-reference', 0.5, observeTagSearch);" %>
    <h3>Available Tags for <span id="page-type"><%= @page.class.display_name %></span></h3>
    <div id="tag-reference"><%= tag_reference(@page.class.name) %></div>
    <p><%= link_to_function 'Close', "Element.hide('tag-reference-popup')", :class => 'close-link' %></p>
  </div>
  <div class="popup" id="filter-reference-popup" style="display:none;">
    <h3><span id="filter-type"><%= default_filter_name %></span> Reference</h3>
    <div id="filter-reference"><%= filter_reference(default_filter_name) %></div>
    <p><%= link_to_function 'Close', "Element.hide('filter-reference-popup')", :class => 'close-link' %></p>
  </div>
<% end -%>
<script type="text/javascript">
  toggleFCKeditor(<%= @index - 1 %>);
</script>
<%= focus 'page_title' %>